import { useUserStore } from '@/stores/user'

/**
 * 检查用户是否拥有指定角色
 * @param {String|Array} roles 需要的角色
 * @returns {Boolean}
 */
export function checkPermission(roles) {
  if (!roles) return true
  const userStore = useUserStore()
  const userRoles = userStore.roles
  
  if (Array.isArray(roles)) {
    return userRoles.some(role => roles.includes(role))
  } else {
    return userRoles.includes(roles)
  }
}

/**
 * 创建权限指令
 * @param {Object} app Vue 应用实例
 */
export function setupPermission(app) {
  /**
   * 权限指令
   * 使用方式：v-permission="['admin']" 或 v-permission="'admin'"
   */
  app.directive('permission', {
    mounted(el, binding) {
      const { value } = binding
      const hasPermission = checkPermission(value)
      
      if (!hasPermission) {
        el.parentNode && el.parentNode.removeChild(el)
      }
    }
  })

  /**
   * 角色指令
   * 使用方式：v-role="['admin']" 或 v-role="'admin'"
   * 功能同 v-permission，只是名字不同
   */
  app.directive('role', {
    mounted(el, binding) {
      const { value } = binding
      const hasPermission = checkPermission(value)
      
      if (!hasPermission) {
        el.parentNode && el.parentNode.removeChild(el)
      }
    }
  })
}